{% extends "pos/base.html" %}
{% load static %}

{% block title %}Sale Approval Result{% endblock %}
{% block heading %}Sale Approval Result{% endblock %}

{% block stylesheets %}
<link rel="stylesheet" href="{% static 'styles/pos_api_v2/offline/approvals/approval.css' %}">
{% endblock %}

{% block content %}

<div class="approval-page">

    <div class="approval-detail-header">
        <div>
            <h4>Sale Approval Result</h4>
            <p>Total: {{ total }} | Approved: {{ approved_count }} | Failed: {{ failed_count }}</p>
        </div>

        <div class="approval-detail-actions">
            <a href="{% url 'pos_api_v2:offline:approvals:sale_approval_list' %}" class="btn btn-primary">
                Back to Sales Approval
            </a>
        </div>
    </div>

    <div class="approval-summary-row">
        <div class="approval-summary-card">
            <span>Total Selected</span>
            <strong>{{ total }}</strong>
        </div>
        <div class="approval-summary-card">
            <span>Approved</span>
            <strong>{{ approved_count }}</strong>
        </div>
        <div class="approval-summary-card">
            <span>Failed</span>
            <strong>{{ failed_count }}</strong>
        </div>
    </div>

    <div class="approval-table-card">
        <h5>Approved Invoices</h5>

        <table class="table table-bordered approval-table">
            <thead>
                <tr>
                    <th>Staging Invoice</th>
                    <th>Live Invoice</th>
                    <th>Bank Rows</th>
                    <th>Deleted Staging Rows</th>
                    <th>Message</th>
                </tr>
            </thead>
            <tbody>
                {% for r in approved %}
                    <tr>
                        <td>#{{ r.invoice_no }}</td>
                        <td>
                            <span class="approval-badge approved">#{{ r.live_invoice_no }}</span>
                        </td>
                        <td>{{ r.bank_rows }}</td>
                        <td>{{ r.deleted }}</td>
                        <td>
                            {{ r.message }}

                            {% if r.is_partial %}
                                <br>
                                <small class="text-danger">
                                    Partial sale: ordered stock zyada tha, available stock approve hua,
                                    remaining qty skipped/deleted.
                                </small>
                                <br>
                                <small>
                                    Original Total: {{ r.original_total_amount|floatformat:2 }} |
                                    Approved Total: {{ r.approved_total_amount|floatformat:2 }}
                                </small>
                            {% endif %}
                        </td>
                    </tr>
                {% empty %}
                    <tr>
                        <td colspan="5" class="approval-empty">No invoice approved.</td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>

    <div class="approval-table-card">
        <h5>Partial Approved Items</h5>

        <table class="table table-bordered approval-table">
            <thead>
                <tr>
                    <th>Invoice</th>
                    <th>Live Invoice</th>
                    <th>Product</th>
                    <th>Ordered Qty</th>
                    <th>Available Qty</th>
                    <th>Approved Qty</th>
                    <th>Skipped Qty</th>
                    <th>Bonus</th>
                    <th>Stock Source</th>
                    <th>Message</th>
                </tr>
            </thead>
            <tbody>
                {% for item in partial_rows %}
                    <tr>
                        <td>#{{ item.invoice_no }}</td>
                        <td>#{{ item.live_invoice_no }}</td>
                        <td>
                            <strong>{{ item.product_name|default:"Product" }}</strong><br>
                            <small>Code: {{ item.product_code }}</small>
                        </td>
                        <td>{{ item.requested_qty|floatformat:2 }}</td>
                        <td>{{ item.available_qty|floatformat:2 }}</td>
                        <td>
                            <span class="approval-badge approved">
                                {{ item.approved_qty|floatformat:2 }}
                            </span>
                        </td>
                        <td>
                            <span class="approval-badge rejected">
                                {{ item.short_qty|floatformat:2 }}
                            </span>
                        </td>
                        <td>
                            Ordered: {{ item.requested_bonus|floatformat:2 }}<br>
                            Available: {{ item.available_bonus|floatformat:2 }}<br>
                            Approved: {{ item.approved_bonus|floatformat:2 }}<br>
                            Skipped: {{ item.short_bonus|floatformat:2 }}
                        </td>
                        <td>{{ item.stock_source }}</td>
                        <td>{{ item.message }}</td>
                    </tr>
                {% empty %}
                    <tr>
                        <td colspan="10" class="approval-empty">No partial approved item.</td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>

    <div class="approval-table-card">
        <h5>Failed / Blocked Invoices</h5>

        <table class="table table-bordered approval-table">
            <thead>
                <tr>
                    <th>Invoice</th>
                    <th>Product</th>
                    <th>Reason</th>
                    <th>Required</th>
                    <th>Available</th>
                    <th>Settings</th>
                    <th>Action</th>
                </tr>
            </thead>
            <tbody>
                {% for r in failed %}
                    <tr>
                        <td>
                            <span class="approval-badge rejected">#{{ r.invoice_no }}</span>
                        </td>
                        <td>
                            {% if r.product_code %}
                                <strong>{{ r.product_name|default:"Product" }}</strong><br>
                                <small>Code: {{ r.product_code }}</small>
                            {% else %}
                                -
                            {% endif %}
                        </td>
                        <td>
                            <strong>{{ r.message }}</strong><br>
                            <small class="text-muted">{{ r.reason }}</small>
                        </td>
                        <td>
                            Qty: {{ r.required_qty|floatformat:2 }}<br>
                            Bonus: {{ r.required_bonus|floatformat:2 }}
                        </td>
                        <td>
                            Qty: {{ r.available_qty|floatformat:2 }}<br>
                            Bonus: {{ r.available_bonus|floatformat:2 }}
                        </td>
                        <td>
                            <small>
                                Zero Stock: {{ r.settings.zero_stock_allow|default:"-" }}<br>
                                Check Batch: {{ r.settings.check_batch|default:"-" }}<br>
                                Expiry Warn: {{ r.settings.expiry_warn_days|default:"0" }}
                            </small>
                        </td>
                        <td>
                            <a class="btn btn-sm btn-primary"
                               href="{% url 'pos_api_v2:offline:approvals:sale_approval_detail' r.invoice_no %}">
                                View
                            </a>
                        </td>
                    </tr>
                {% empty %}
                    <tr>
                        <td colspan="7" class="approval-empty">No failed invoice.</td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>

</div>

{% endblock %}